<ng-container *ngIf="gloadService.clientType==='pxw'||gloadService.clientType==='ppw'">
  <section>
    <p class="tips" *ngIf="tagData.data?.tips">{{tagData.data.tips}}</p>
    <div id="qr-bg{{uuid}}" class="qr-bg">
      <img class="ppw-logo" *ngIf="tagData.data?.ppwLogo" [ngStyle]="tagData.data?.ppwLogoCssStyle|styleFilter"
        src="{{tagData.data?.ppwLogo}}" alt="">
      <p class="serviceContent">{{tagData.data.serviceContent}}</p>
      <img id="qrcode" class="pay-qrcode" [ngStyle]="tagData.data.info?.qrCodeUrlCssStyle|styleFilter"
        src="{{qrCodeUrl}}" alt="">
      <p class="qrTips">{{tagData.data.qrTips}}</p>
    </div>
    <p class="resultTips">{{tagData.data.resultTips}}</p>
  </section>
  <ion-footer style="position: absolute;
  bottom: 0rem;">
    <div style="text-align: center; margin-bottom: 1.88rem;">
      <div class="saveBtn" appDebounceClick (debounceClick)="savePhoto()">{{tagData.data.saveBtn}}</div>
    </div>
  </ion-footer>
</ng-container>
<ng-container *ngIf="gloadService.clientType==='lj'||gloadService.clientType==='js'">
  <section>

    <p class="tips" *ngIf="tagData.data.info.tips">{{tagData.data.info.tips}}</p>

    <ng-container *ngIf="tagData.data.info?.uploadImgMode; else elseNormalTemplate">

      <ng-container *ngIf="tagData.data.info?.uploadImgMode === 'callingCardPreview'; else elseShopGoodDetail">
        <!--2024.9.9 表单名片预览时 isUpload = 0 -->
        <div [ngStyle]="tagData.data.info?.qrbgcssStyle|styleFilter">
          <div  [ngStyle]="tagData.data.info?.qrInnerBoxcssStyle|styleFilter">
            <div id="qr-bg{{uuid}}"  class=""
              [ngStyle]="tagData.data.info?.cardBgCssStyle|styleFilter">
              
              <img id="bgImg" onload="window['appGlobalService'].loadSharePicCallBack('bgImg')" 
                  *ngIf="bgImg" onerror="onerror=null;"  src="{{bgImg}}" alt=""
                  [ngStyle]="tagData.data.info?.bgImgCssStyle|styleFilter">

              <div *ngIf="tagData.data.info?.filterCssStyle" [ngStyle]="tagData.data.info?.filterCssStyle|styleFilter"></div>
              <div [ngStyle]="tagData.data.info?.nameAndQrcodeBgCssStyle|styleFilter">
                <div [ngStyle]="tagData.data.info?.nameContentBgCssStyle|styleFilter">
                  <p [ngStyle]="tagData.data.info?.nameCssStyle|styleFilter">{{tagData.data.info.nickName}}</p>
                  <p *ngIf="tagData.data.info?.job" [ngStyle]="tagData.data.info?.jobCssStyle|styleFilter">{{tagData.data.info.job}}</p>
                  <p class="no-line" [ngStyle]="tagData.data.info?.lineCssStyle|styleFilter"></p>

                </div>
                <div [ngStyle]="tagData.data.info?.qrcodeContentBgCssStyle|styleFilter">

                  <i style="justify-content: center;display: flex;align-items: center;position: relative;" [ngStyle]="tagData.data.info?.iTagCssStyle|styleFilter">
                    <img id="center-pic" class="center-pic" *ngIf="tagData.data.info?.centerLogo" onload="window['appGlobalService'].loadSharePicCallBack('center-pic')" 
                      [ngStyle]="tagData.data?.info?.centerLogoCssStyle|styleFilter" src="{{defaultCenterLogo}}" alt="">

                    <img id="qrcode" class="pay-qrcode" src="{{qrCodeUrl}}" alt="" onload="window['appGlobalService'].loadSharePicCallBack('qrcode')" 
                    *ngIf="qrCodeUrl" onerror="onerror=null;"
                    [ngStyle]="tagData.data.info?.qrCodeUrlCssStyle|styleFilter">
                  </i>

                  <p [ngStyle]="tagData.data.info?.qrCodeLabelCssStyle|styleFilter">{{tagData.data.info?.qrCodeLabel}}</p>
                </div>
              </div>

              <div [ngStyle]="tagData.data.info?.cpyInfoBgCssStyle|styleFilter">
                
                <img id="logoUrl"  onload="window['appGlobalService'].loadSharePicCallBack('logoUrl')"
                  *ngIf="logoUrl" onerror="onerror=null;" src="{{logoUrl}}" alt=""
                  [ngStyle]="tagData.data.info?.logoUrlCssStyle|styleFilter">
                  
                <div [ngStyle]="tagData.data.info?.cpyInfoContentBgCssStyle|styleFilter" [ngClass]="{'center-phone': !tagData.data.info.cpyName}">
                  <p  [ngStyle]="tagData.data.info?.cpyNameCssStyle|styleFilter" *ngIf="tagData.data.info?.cpyName">{{tagData.data.info?.cpyName}}</p>
                  <div [ngStyle]="tagData.data.info?.phoneBgContentBgCssStyle|styleFilter">
                    <img id="phoneIconUrl" onload="window['appGlobalService'].loadSharePicCallBack('phoneIconUrl')"
                    *ngIf="phoneIconUrl" onerror="onerror=null;" src="{{phoneIconUrl}}" alt=""
                   [ngStyle]="tagData.data.info?.phoneIconUrlCssStyle|styleFilter">
                    <p *ngIf="tagData.data.info?.phone" [ngStyle]="tagData.data.info?.phoneCssStyle|styleFilter">{{tagData.data.info?.phone}}</p>
                  </div>
                </div>
              </div>
  
              
  

  
            </div>
            
            <p class="card-tips" [ngStyle]="tagData.data.info?.cardTipsCssStyle|styleFilter" *ngIf="tagData.data.info.cardTips">{{tagData.data.info.cardTips}}</p>
          </div>
        </div>
      </ng-container>
      <!-- js v2.3.11之前的  -->
      <ng-template #elseShopGoodDetail>
        <div [ngStyle]="tagData.data.info?.qrbgcssStyle|styleFilter">
          <div class="qrInnerBox" [ngStyle]="tagData.data.info?.qrInnerBoxcssStyle|styleFilter">
            <div id="qr-bg{{uuid}}" appDebounceClick (debounceClick)="savePhoto2()" class="iTagCssStyle"
              [ngStyle]="tagData.data.info?.iTagCssStyle|styleFilter">
  
              
              <img id="top-image" onload="window['appGlobalService'].loadSharePicCallBack('top-image')" class="top-image"
                *ngIf="topImagUrl" onerror="onerror=null;" class="top-image" src="{{topImagUrl}}" alt=""
                [ngStyle]="tagData.data.info?.topImagUrlCssStyle|styleFilter">
  
              <img id="centerImageUrl" onload="window['appGlobalService'].loadSharePicCallBack('centerImageUrl')"
                class="centerImageUrl" *ngIf="centerImagUrl" onerror="onerror=null;" src="{{centerImagUrl}}" alt=""
                [ngStyle]="tagData.data.info?.centerImagUrlCssStyle|styleFilter">
  
              <img id="bottom-image" onload="window['appGlobalService'].loadSharePicCallBack('bottom-image')"
                class="bottom-image2" *ngIf="bottomImagUrl" onerror="onerror=null;" src="{{bottomImagUrl}}" alt=""
                [ngStyle]="tagData.data.info?.bottomImagUrlCssStyle|styleFilter">
  
  
  
              <div class="left-item-amount" *ngIf="tagData.data.info?.leftAmount"
                [ngStyle]="tagData.data.info?.leftAmountBoxCssStyle|styleFilter">
                <font class="left-amount-unit" *ngIf="tagData.data.info?.leftAmountUnit"
                  [ngStyle]="tagData.data.info?.leftAmountUnitCssStyle|styleFilter">
                  {{tagData.data.info?.leftAmountUnit}}</font>
  
                <font class="left-amount" *ngIf="tagData.data.info?.leftAmount"
                  [ngStyle]="tagData.data.info?.leftAmountCssStyle|styleFilter">
                  {{(getInterger(tagData.data.info?.leftAmount - 0) | currency:'CNY':'':'1.0-0')}}
                </font>
                <i class="price-digits-new" *ngIf="tagData.data.info?.leftAmount"
                  [ngStyle]="tagData.data.info?.leftAmountDigitsCssStyle|styleFilter">{{(tagData.data.info?.leftAmount
                  - 0 | currency:'CNY':'':'0.2-2')+''|slice:-3}}</i>
  
                <font class="left-amount" *ngIf="tagData.data.info?.leftAmount1"
                  [ngStyle]="tagData.data.info?.leftAmount1CssStyle|styleFilter">
                  {{tagData.data.info?.leftAmount1}}</font>
  
  
                <font class="left-amount-unit" *ngIf="tagData.data.info?.leftLabel"
                  [ngStyle]="tagData.data.info?.leftLabelCssStyle|styleFilter">
                  {{tagData.data.info?.leftLabel}}</font>
                <font class="left-amount-unit" [ngStyle]="tagData.data.info?.leftLabel1CssStyle|styleFilter"
                  *ngIf="tagData.data.info?.leftLabel1">
                  {{tagData.data.info?.leftLabel1}}</font>
              </div>
  
            </div>
  
            <div class="avatarRightBox" *ngIf="tagData.data.info?.lableBoxCssStyle"
              [ngStyle]="tagData.data?.info?.lableBoxCssStyle|styleFilter">
              <span class="title" *ngIf="tagData.data.info?.lable1CssStyle"
                [ngStyle]="tagData.data.info?.lable1CssStyle|styleFilter">{{tagData.data.info?.lable1}}
                <font *ngIf="tagData.data.info?.lable1Tips" [ngStyle]="tagData.data.info?.lable1TipsCssStyle|styleFilter">
                  {{tagData.data.info?.lable1Tips}}
                </font>
              </span>
  
              <span class="title" *ngIf="tagData.data.info?.lable2CssStyle"
                [ngStyle]="tagData.data.info?.lable2CssStyle|styleFilter">{{tagData.data.info?.lable2}}
                <font *ngIf="tagData.data.info?.lable2Tips" [ngStyle]="tagData.data.info?.lable2TipsCssStyle|styleFilter">
                  {{tagData.data.info?.lable2Tips}}
                </font>
              </span>
  
              <span class="title" *ngIf="tagData.data.info?.lable3CssStyle"
                [ngStyle]="tagData.data.info?.lable3CssStyle|styleFilter">{{tagData.data.info?.lable3}}
                <font *ngIf="tagData.data.info?.lable3Tips" [ngStyle]="tagData.data.info?.lable3TipsCssStyle|styleFilter">
                  {{tagData.data.info?.lable3Tips}}
                </font>
              </span>
  
              <span class="title" *ngIf="tagData.data.info?.lable4CssStyle"
                [ngStyle]="tagData.data.info?.lable4CssStyle|styleFilter">{{tagData.data.info?.lable4}}
                <font *ngIf="tagData.data.info?.lable4Tips" [ngStyle]="tagData.data.info?.lable4TipsCssStyle|styleFilter">
                  {{tagData.data.info?.lable4Tips}}
                </font>
              </span>
  
  
  
            </div>
          </div>
        </div> 
      </ng-template>
      
      

    </ng-container>
    <ng-template #elseNormalTemplate>

      <div id="qr-bg{{uuid}}" class="qr-bg" [ngStyle]="tagData.data.info?.qrbgcssStyle|styleFilter">
        <img class="ppw-logo" *ngIf="tagData.data.info?.ppwLogo"
          [ngStyle]="tagData.data?.info?.ppwLogoCssStyle|styleFilter" src="{{tagData.data.info?.ppwLogo}}" alt="">

        <div class="avatarMainBox" *ngIf="tagData.data.info?.avatarBox"
          [ngStyle]="tagData.data?.info?.avatarBoxCssStyle|styleFilter">

          <img class="avatarBox" *ngIf="tagData.data.info?.avatarPic"
            [ngStyle]="tagData.data?.info?.avatarPicCssStyle|styleFilter" src="{{avatarIcon}}" alt="">

          <div class="avatarRightBox" [ngStyle]="tagData.data?.info?.avatarRightBoxCssStyle|styleFilter">
            <span class="title" *ngIf="tagData.data.info?.nickName"
              [ngStyle]="tagData.data.info?.nickNameCssStyle|styleFilter">{{tagData.data.info?.nickName}}
              <font *ngIf="tagData.data.info?.nickNameTips"
                [ngStyle]="tagData.data.info?.nickNameTipsCssStyle|styleFilter">{{tagData.data.info?.nickNameTips}}
              </font>
            </span>

            <span class="title" *ngIf="tagData.data.info?.telePhone"
              [ngStyle]="tagData.data.info?.telePhoneCssStyle|styleFilter">{{tagData.data.info?.telePhone}}
              <font *ngIf="tagData.data.info?.telePhoneTips"
                [ngStyle]="tagData.data.info?.telePhoneTipsCssStyle|styleFilter">{{tagData.data.info?.telePhoneTips}}
              </font>
            </span>

          </div>


        </div>

        <p [ngStyle]="tagData.data.info?.serviceContentCssStyle|styleFilter" class="serviceContent">
          {{tagData.data.info?.serviceContent}}
          <span class="title" *ngIf="tagData.data.info?.serviceMoney"
            [ngStyle]="tagData.data.info?.serviceMoneyCssStyle|styleFilter">{{tagData.data.info?.serviceMoney}}</span>
          <span class="title" *ngIf="tagData.data.info?.serviceUnit"
            [ngStyle]="tagData.data.info?.serviceUnitCssStyle|styleFilter">{{tagData.data.info?.serviceUnit}}</span>
        </p>
        <img class="center-pic" *ngIf="tagData.data.info?.centerLogo2"
          [ngStyle]="tagData.data?.info?.centerLogo2CssStyle|styleFilter" src="{{defaultCenterLogo2}}" alt="">
        <p *ngIf="tagData.data.info?.contentTips" [ngStyle]="tagData.data.info?.contentTipsCssStyle|styleFilter">
          {{tagData.data.info?.contentTips}}</p>
        <p *ngIf="tagData.data.info?.contentTips1" [ngStyle]="tagData.data.info?.contentTips1CssStyle|styleFilter">
          {{tagData.data.info?.contentTips1}}</p>
        <p *ngIf="tagData.data.info?.contentTips2" [ngStyle]="tagData.data.info?.contentTips2CssStyle|styleFilter">
          {{tagData.data.info?.contentTips2}}</p>

        <i appDebounceClick (debounceClick)="savePhoto()"
          style="justify-content: center;display: flex;align-items: center;"
          [ngStyle]="tagData.data.info?.iTagCssStyle|styleFilter">
          <img class="center-pic" *ngIf="tagData.data.info?.centerLogo"
            [ngStyle]="tagData.data?.info?.centerLogoCssStyle|styleFilter" src="{{defaultCenterLogo}}" alt="">

          <img id="qrcode" class="pay-qrcode" src="{{qrCodeUrl}}" alt=""
            [ngStyle]="tagData.data.info?.qrCodeUrlCssStyle|styleFilter">

          <img class="scan-pic" *ngIf="tagData.data.info?.scanPic"
            [ngStyle]="tagData.data?.info?.scanPicCssStyle|styleFilter" src="{{tagData.data.info?.scanPic}}" alt="">
        </i>


        <p class="qrTips" *ngIf="tagData.data.info.qrTips" [ngStyle]="tagData.data?.info?.qrTipsCssStyle|styleFilter">
          {{tagData.data.info.qrTips}}</p>
        <p *ngIf="tagData.data?.info?.accountDescCssStyle"
          [ngStyle]="tagData.data?.info?.accountDescCssStyle|styleFilter">
          <span [ngStyle]="tagData.data?.info?.accountDescLabelCssStyle|styleFilter">
            {{tagData.data?.info?.accountDescLabel}}
          </span>
          <span [ngStyle]="tagData.data?.info?.accountDescValueCssStyle|styleFilter">
            {{tagData.data?.info?.accountDescValue}}
          </span>
        </p>
        <p *ngIf="tagData.data?.info?.servicePersonCssStyle"
          [ngStyle]="tagData.data?.info?.servicePersonCssStyle|styleFilter">
          <span [ngStyle]="tagData.data?.info?.servicePersonLabelCssStyle|styleFilter">
            {{tagData.data?.info?.servicePersonLabel}}
          </span>
          <span [ngStyle]="tagData.data?.info?.servicePersonValueCssStyle|styleFilter">
            {{tagData.data?.info?.servicePersonValue}}
          </span>
        </p>
      </div>
    </ng-template>



    <div class="invite-bg" [ngStyle]="tagData.data.info?.inviteBoxCssStyle|styleFilter">
      <img *ngIf="tagData.data.info?.inviteAvator" [src]="tagData.data.info?.inviteAvator"
        onerror="this.src='assets/img/headtrait.png'" [ngStyle]="tagData.data.info?.inviteAvatorCssStyle|styleFilter"
        class="inviteAvator" />
      <div class="invite-divBox" [ngStyle]="tagData.data.info?.inviteDivBoxCssStyle|styleFilter">
        <p class="inviteName" *ngIf="tagData.data.info?.inviteName"
          [ngStyle]="tagData.data.info?.inviteNameCssStyle|styleFilter">{{tagData.data.info?.inviteName}}</p>
        <p class="invitePhone" *ngIf="tagData.data.info?.invitePhone"
          [ngStyle]="tagData.data.info?.invitePhoneCssStyle|styleFilter">{{tagData.data.info?.invitePhone}}</p>
      </div>
    </div>

    <p class="resultTips" [ngStyle]="tagData.data.info?.resultTipsCssStyle|styleFilter">{{tagData.data.info.resultTips}}
    </p>

  </section>
  <ion-footer *ngIf="tagData.data?.info?.hiddenFooter===undefined" style="position: absolute; bottom: 0rem;">
    <!-- <div style="text-align: center; margin-bottom: 1.88rem;">
      <div class="saveBtn" appDebounceClick (debounceClick)="savePhoto()">{{tagData.data.info.saveBtn}}</div>
    </div> -->
    <div class="share-btn-box">
      <div class="save-pic-box" *ngIf="tagData.data.wechat">
        <button id="wechat{{uuid}}" class="wechat-btn" [ngStyle]="tagData.data.wechat.cssStyle|styleFilter"
          appDebounceClick
          (debounceClick)="shareWechat(tagData.data.wechat.isDouyin,tagData.data.wechat.title,tagData.data.wechat.content,tagData.data.wechat.imgUrl,tagData.data.wechat.webpageUrl)">
          <img src="{{tagData.data.wechat.icon}}" onerror="this.src='assets/icon/share_icon_download@3x.png'"
            class="common-save-pic" />
        </button>
        <label class="share-btn-label"
          [ngStyle]="tagData.data.wechat.labelCssStyle|styleFilter">{{tagData.data.wechat.label}}</label>
      </div>

      <div class="save-pic-box" *ngIf="tagData.data.qq">
        <button id="qq{{uuid}}" class="qq-btn" [ngStyle]="tagData.data.qq.cssStyle|styleFilter" appDebounceClick
          (debounceClick)="shareQQ(tagData.data.qq.isDouyin,tagData.data.qq.title,tagData.data.qq.content,tagData.data.qq.imgUrl,tagData.data.qq.webpageUrl)">
          <img src="{{tagData.data.qq.icon}}" onerror="this.src='assets/icon/share_icon_download@3x.png'"
            class="common-save-pic" />
        </button>
        <label class="share-btn-label"
          [ngStyle]="tagData.data.qq.labelCssStyle|styleFilter">{{tagData.data.qq.label}}</label>
      </div>

      <div class="save-pic-box" *ngIf="tagData.data.savePic">
        <button id="savepic{{uuid}}" class="save-pic-btn" [ngStyle]="tagData.data.savePic.cssStyle|styleFilter"
          appDebounceClick
          (debounceClick)="savePic(tagData.data.savePic.isDouyin,tagData.data.savePic.title,tagData.data.savePic.content,tagData.data.savePic.webpageUrl,'savepic')">
          <img src="{{tagData.data.savePic.icon}}" onerror="this.src='assets/icon/share_icon_download@3x.png'"
            class="common-save-pic" />
        </button>
        <label class="share-btn-label"
          [ngStyle]="tagData.data.savePic.labelCssStyle|styleFilter">{{tagData.data.savePic.label}}</label>
      </div>
      <div class="save-pic-box" *ngIf="tagData.data.copy">
        <button id="copy{{uuid}}" class="save-pic-btn" [ngStyle]="tagData.data.copy.cssStyle|styleFilter"
          appDebounceClick
          (debounceClick)="copyUrl(tagData.data.copy.isDouyin,tagData.data.copy.title,tagData.data.copy.content,tagData.data.copy.webpageUrl,'copy')">
          <img src="{{tagData.data.copy.icon}}" onerror="this.src='assets/icon/share_icon_download@3x.png'"
            class="common-save-pic" />
        </button>
        <label class="share-btn-label"
          [ngStyle]="tagData.data.copy.labelCssStyle|styleFilter">{{tagData.data.copy.label}}</label>
      </div>
    </div>
  </ion-footer>
</ng-container>